<template>
	<div class="assurePerson">
		<div v-for="(vm , index) in infoList">
			<div class="title">个人信息</div>
			<div>
				<el-row class="info-row" v-show="isEdit == true">
					<el-col :span="3" class="subTitle">
						姓名
					</el-col>
					<el-col :span="5">
						<el-input class="info-input" v-model="vm.personalInfo.name" :disabled="disabled"></el-input>
					</el-col>
					<el-col :span="3" class="subTitle">
						身份证地址
					</el-col>
					<el-col :span="13">
						<el-input class="info-input" v-model="vm.personalInfo.identityAddress"></el-input>
					</el-col>
				</el-row>
				<el-row class="info-row" v-show="isEdit == false">
					<el-col :span="8" class="info-label">
						姓名：
						<label class="text">{{vm.personalInfo.name}}</label>
					</el-col>
					<el-col :span="13" class="info-label">
						身份证地址：
						<label class="text">{{vm.personalInfo.identityAddress}}</label>
					</el-col>
				</el-row>
				<el-row class="info-row" v-show="isEdit == true">
					<el-col :span="3" class="subTitle">
						身份证号
					</el-col>
					<el-col :span="5">
						<el-input class="info-input" v-model="vm.personalInfo.identityCode" :disabled="disabled"></el-input>
					</el-col>
					<el-col :span="3" class="subTitle">
						身份证归属地
					</el-col>
					<el-col :span="5">
						<el-input class="info-input" v-model="vm.personalInfo.identityCounty" :disabled="disabled"></el-input>
					</el-col>
					<el-col :span="3" class="subTitle">
						出生日期
					</el-col>
					<el-col :span="5">
						<el-input class="info-input" v-model="vm.personalInfo.age" :disabled="disabled"></el-input>
					</el-col>
				</el-row>
				<el-row class="info-row" v-show="isEdit == false">
					<el-col :span="8" class="info-label">
						身份证号：
						<label class="text">{{vm.personalInfo.identityCode}}</label>
					</el-col>
					<el-col :span="8" class="info-label">
						身份证归属地：
						<label class="text">{{vm.personalInfo.identityCounty}}</label>
					</el-col>
					<el-col :span="8" class="info-label">
						出生日期：
						<label class="text">{{vm.personalInfo.age}}</label>
					</el-col>
				</el-row>
				<el-row class="info-row" v-show="isEdit == true">
					<el-col :span="3" class="subTitle">
						性别
					</el-col>
					<el-col :span="5">
						<el-select class="info-select" :disabled="disabled" v-model="vm.personalInfo.sex" placeholder="请选择">
							<el-option v-for="item in $store.state.sex" :key="item.value" :label="item.label" :value="item.value">
							</el-option>
						</el-select>
					</el-col>
					<el-col :span="3" class="subTitle">
						学历
					</el-col>
					<el-col :span="5">
						<el-select class="info-select" v-model="vm.personalInfo.education" placeholder="请选择">
							<el-option v-for="item in $store.state.education" :key="item.value" :label="item.label" :value="item.value">
							</el-option>
						</el-select>
					</el-col>
					<el-col :span="3" class="subTitle">
						户籍
					</el-col>
					<el-col :span="5">
						<el-input class="info-input" v-model="vm.personalInfo.residence"></el-input>
					</el-col>
				</el-row>
				<el-row class="info-row" v-show="isEdit == false">
					<el-col :span="8" class="info-label">
						性别：
						<label class="text">{{vm.personalInfo.sex_name}}</label>
					</el-col>
					<el-col :span="8" class="info-label">
						学历：
						<label class="text">{{vm.personalInfo.education_name}}</label>
					</el-col>
					<el-col :span="8" class="info-label">
						户籍：
						<label class="text">{{vm.personalInfo.residence}}</label>
					</el-col>
				</el-row>
				<el-row class="info-row" v-show="isEdit == true">
					<el-col :span="3" class="subTitle">
						手机号码
					</el-col>
					<el-col :span="5">
						<el-input class="info-input" :maxlength='11' v-model="vm.personalInfo.phone" @change="phoneChange(vm , index)"></el-input>
					</el-col>
					<el-col :span="3" class="subTitle">
						手机归属地
					</el-col>
					<el-col :span="5">
						<el-input class="info-input" v-model="vm.personalInfo.phoneAddress" :disabled="disabled"></el-input>
					</el-col>
					<el-col :span="3" class="subTitle">
						婚姻状态
					</el-col>
					<el-col :span="5">
						<el-select class="info-select" v-model="vm.personalInfo.marry" placeholder="请选择">
							<el-option v-for="item in $store.state.marryStatus" :key="item.value" :label="item.label" :value="item.value">
							</el-option>
						</el-select>
					</el-col>
				</el-row>
				<el-row class="info-row" v-show="isEdit == false">
					<el-col :span="8" class="info-label">
						手机号码：
						<label class="text">{{vm.personalInfo.phone}}</label>
					</el-col>
					<el-col :span="8" class="info-label">
						手机归属地：
						<label class="text">{{vm.personalInfo.phoneAddress}}</label>
					</el-col>
					<el-col :span="8" class="info-label">
						婚姻状态：
						<label class="text">{{vm.personalInfo.marry_name}}</label>
					</el-col>
				</el-row>
				<el-row class="info-row" v-show="isEdit == true">
					<el-col :span="3" class="subTitle">
						与购车人关系
					</el-col>
					<el-col :span="5">
						<el-select class="info-select" v-model="vm.personalInfo.link" placeholder="请选择">
							<el-option v-for="item in $store.state.linkOther" :key="item.value" :label="item.label" :value="item.value">
							</el-option>
						</el-select>
					</el-col>
					<el-col :span="3" class="subTitle">
						现住地址
					</el-col>
					<el-col :span="13">
						<el-input class="info-input" v-model="vm.personalInfo.address"></el-input>
					</el-col>
				</el-row>
				<el-row class="info-row" v-show="isEdit == false">
					<el-col :span="8" class="info-label">
						与购车人关系：
						<label class="text">{{vm.personalInfo.link_name}}</label>
					</el-col>
					<el-col :span="13" class="info-label">
						现住地址：
						<label class="text">{{vm.personalInfo.address}}</label>
					</el-col>
				</el-row>
			</div>
			<div class="title">单位信息</div>
			<div>
				<el-row class="info-row" v-show="isEdit == true">
					<el-col :span="3" class="subTitle">
						单位名称
					</el-col>
					<el-col :span="5">
						<el-input class="info-input" v-model="vm.unitInfo.name"></el-input>
					</el-col>
					<el-col :span="3" class="subTitle">
						单位地址
					</el-col>
					<el-col :span="13">
						<el-input class="info-input" v-model="vm.unitInfo.address"></el-input>
					</el-col>
				</el-row>
				<el-row class="info-row" v-show="isEdit == false">
					<el-col :span="8" class="info-label">
						单位名称：
						<label class="text">{{vm.unitInfo.name}}</label>
					</el-col>
					<el-col :span="13" class="info-label">
						单位地址：
						<label class="text">{{vm.unitInfo.address}}</label>
					</el-col>
				</el-row>
				<el-row class="info-row" v-show="isEdit == true">
					<el-col :span="3" class="subTitle">
						单位类别
					</el-col>
					<el-col :span="5">
						<el-select class="info-select" v-model="vm.unitInfo.type">
							<el-option v-for="item in $store.state.unitType" :key="item.value" :label="item.label" :value="item.value">
							</el-option>
						</el-select>
					</el-col>
					<el-col :span="3" class="subTitle">
						职位
					</el-col>
					<el-col :span="5">
						<el-select class="info-select" v-model="vm.unitInfo.job">
							<el-option v-for="item in $store.state.job" :key="item.value" :label="item.label" :value="item.value">
							</el-option>
						</el-select>
					</el-col>
					<el-col :span="3" class="subTitle">
						月收入
					</el-col>
					<el-col :span="5">
						<el-input class="info-input" v-model="vm.unitInfo.priceMoney">
							<template slot="append">元</template>
						</el-input>
					</el-col>
				</el-row>
				<el-row class="info-row" v-show="isEdit == false">
					<el-col :span="8" class="info-label">
						单位类别：
						<label class="text">{{vm.unitInfo.type_name}}</label>
					</el-col>
					<el-col :span="8" class="info-label">
						职位：
						<label class="text">{{vm.unitInfo.job_name}}</label>
					</el-col>
					<el-col :span="8" class="info-label">
						月收入：
						<label class="text">{{vm.unitInfo.priceMoney}}元</label>
					</el-col>
				</el-row>
				<el-row class="info-row" v-show="isEdit == true">
					<el-col :span="3" class="subTitle">
						工龄
					</el-col>
					<el-col :span="5">
						<el-select class="info-select" v-model="vm.unitInfo.seniority">
							<el-option v-for="item in $store.state.seniority" :key="item.value" :label="item.label" :value="item.value">
							</el-option>
						</el-select>
					</el-col>
					<el-col :span="3" class="subTitle">
						单位电话
					</el-col>
					<el-col :span="5">
						<el-input class="info-input" v-model="vm.unitInfo.phone">
						</el-input>
					</el-col>
				</el-row>
				<el-row class="info-row" v-show="isEdit == false">
					<el-col :span="8" class="info-label">
						工龄：
						<label class="text">{{vm.unitInfo.seniority_name}}</label>
					</el-col>
					<el-col :span="8" class="info-label">
						单位电话：
						<label class="text">{{vm.unitInfo.phone}}</label>
					</el-col>
				</el-row>
				<el-row class="info-row" v-show="isEdit == true">
					<el-col class="subTitle" :span="3">备注</el-col>
					<el-col :span="21">
						<el-input class="info-textarea" :rows="3" type="textarea" placeholder="请输入" v-model="vm.unitInfo.result"></el-input>
					</el-col>
				</el-row>
				<el-row class="info-row resultShrink" v-show="isEdit == false">
					<el-col class="subtitle" :span="3">备　　注</el-col>
					<el-col :span="12" class="text-height text-height-shrink" :id="'unitInfoAssurePerson'+index">
						{{ vm.unitInfo.result }}
					</el-col>
					<el-col :span="3">
						<el-button class="credit-button-text" type="text" @click="$libs.changeHeight('unitInfoAssurePerson'+index, vm.unitInfo)">{{ vm.unitInfo.shrinkText}}</el-button>
					</el-col>
				</el-row>
			</div>
		</div>
	</div>
</template>
<script>
export default {
	name: 'assurePerson',
	data() {
		return {
			isEdit: false,
			disabled: true,
			isNone: false,
			infoList: []
		}
	},
	watch: {
		infoList: function(_cur, _old) {
			if (_cur && _cur.length > 0) {
				$.each(_cur, (index, el) => {
					console.log(el.phone);
					if (el.personalInfo.phone && el.personalInfo.phone.length >= 11) {
						this.$libs.getPhoneAddress(el.personalInfo.phone, '', this, 'infoList.' + index + '.personalInfo.phoneAddress');
					}

				});
			}
		},
		deep: true
	},
	methods: {
		phoneChange(vm, index) {
			if (vm.personalInfo.phone && vm.personalInfo.phone.length >= 11) {
				this.$libs.getPhoneAddress(vm.personalInfo.phone, '', this, 'infoList.' + index + '.personalInfo.phoneAddress');
				vm.personalInfo.getPhoneAddress = '1111111';
			}
		},
		getInfo(_id, _cb, _cb2) {
			this.infoList = [];
			this.$http.get('/order/underwriterInfo/' + _id).then((data) => {
				if (data.data.success) {
					let dataAll = data.data.data;
					if (!dataAll) {
						this.isNone = true;
					}
					$.each(dataAll, (index, datas) => {
						this.infoList.push({
							personalInfo: {
								name: datas.customerName,
								identityAddress: datas.idCardAddr,
								identityCode: datas.idCard,
								identityCounty: datas.idCardLocation,
								age: datas.idCard.substring(6, 10) + '-' + datas.idCard.substring(10, 12) + '-' + datas.idCard.substring(12, 14),
								sex: this.$libs.toInt(datas.sex),
								sex_name: this.$libs.jsonGetName(this.$store.state.sex, datas.sex),
								education: this.$libs.toInt(datas.education),
								education_name: this.$libs.jsonGetName(this.$store.state.education, datas.education),
								residence: datas.census,
								phone: datas.mobilePhone,
								phoneAddress: datas.mobilePhoneLocation,
								marry: this.$libs.toInt(datas.bemarried),
								marry_name: this.$libs.jsonGetName(this.$store.state.marryStatus, datas.bemarried),
								address: datas.residentialAddr,
								customerId: datas.customerId,
								link: this.$libs.toInt(datas.relationship),
								link_name: this.$libs.jsonGetName(this.$store.state.link, datas.relationship)
							},
							unitInfo: {
								name: datas.orgName,
								address: datas.orgAddr,
								type: this.$libs.toInt(datas.orgType),
								type_name: this.$libs.jsonGetName(this.$store.state.unitType, datas.orgType),
								job: this.$libs.toInt(datas.job),
								job_name: this.$libs.jsonGetName(this.$store.state.job, datas.job),
								priceMoney: datas.monthIncome,
								seniority: this.$libs.toInt(datas.workAge),
								seniority_name: this.$libs.jsonGetName(this.$store.state.seniority, datas.workAge),
								phone: datas.orgTel,
								result: datas.remark,
								shrink: false,
								shrinkText: '展开全部'
							}
						});
					});
					if (_cb2 && (dataAll && dataAll.length > 0)) {
						_cb2();
					} else if (_cb) {
						_cb();
					}
					console.log('infoList');
					console.log(this.infoList);
				} else {
					if (_cb) {
						_cb();
					}
				}
			}).catch((error) => {

			});
		},
		infoEnter(_id, _isMust, _orderStatus, _cb) {
			let param = [];
			let isPhoneCheck = true;
			for (let index = 0; index < this.infoList.length; index++) {
				if (!isPhoneCheck) return;
				let data = this.infoList[index];
				if (data.personalInfo.phone && parseInt(data.personalInfo.phone).toString().length != 11) {
					this.$message.error('担保人手机号码格式有误！');
					isPhoneCheck = false;
					if (_cb) {
						_cb();
					}
					return;
				}
				param.push({
					customerId: data.personalInfo.customerId, //客户记录编号 *
					customerName: data.personalInfo.name, //客户姓名
					idCard: data.personalInfo.identityCode, //身份证号
					idCardLocation: data.personalInfo.identityCounty, //身份证归属地  Y
					idCardAddr: data.personalInfo.identityAddress, //身份证地址 Y
					sex: data.personalInfo.sex, //性别 Y int
					census: data.personalInfo.residence, //户籍 Y
					education: data.personalInfo.education, //学历 Y
					mobilePhone: data.personalInfo.phone, //手机号码 Y
					mobilePhoneLocation: data.personalInfo.phoneAddress, //手机归属地 Y
					bemarried: data.personalInfo.marry, //婚姻状态 Y int
					residentialAddr: data.personalInfo.address, //现住地址 Y
					orgName: data.unitInfo.name, //工作单位名称 Y
					orgType: data.unitInfo.type, //单位类别 Y int
					orgAddr: data.unitInfo.address, // 单位地址 Y
					orgTel: data.unitInfo.phone, // 单位电话 Y
					job: data.unitInfo.job, // 职务 Y
					monthIncome: data.unitInfo.priceMoney, //月收入 Y double
					workAge: data.unitInfo.seniority, //工龄范围类型 Y int
					// remark: data.unitInfo.result, //备注 Y
					relationship: data.personalInfo.link,
				});
			}
			if (param.length == 0) {
				this.id = _id;
				this.orderStatus = _orderStatus;
				this.$store.commit('saveNumAdd', this, _id);
				return;
			}

			if (_isMust && !this.$libs.mustWrite(param)) {
				this.$store.commit('isAllMustFalse');
				if (_cb) {
					_cb();
				}
				this.$libs.noneAddHightBorder();
				return;
			} else if (_isMust) {
				// this.$store.commit('isAllMustTrue');
			}
			for (let index = 0; index < param.length; index++) {
				param[index].remark = this.infoList[index].unitInfo.result;
			}
			this.$http.post('/order/underwriterInfo/' + _id, param).then((data) => {
				console.log(data);
				if (data.data.success) {
					this.id = _id;
					this.orderStatus = _orderStatus;
					this.$store.commit('saveNumAdd', this, _id);
				} else {
					this.$message.error(data.data.message);
				}
			}).catch((error) => {

			});
		}
	},
	mounted() {
		this.$store.commit('education', this);
		this.$store.commit('linkOther', this);
		this.$store.commit('unitType', this);
		this.$store.commit('job', this);
		this.$store.commit('seniority', this);
	}
}

</script>
<style lang="scss" scoped>
@import '../../assets/css/site.scss';
.assurePerson {
	font-size: 14px;
	color: #475669;
	padding-top: 17px;
}

</style>
